<template>
  <view class="viewport">
    <scroll-view enable-back-to-top scroll-y class="scroll">
      <uni-section title="配置账户" type="line">
        <view class="example">
          <uni-forms ref="baseForm" :modelValue="form">
            <uni-forms-item label="账户类型" label-width="170rpx">
              <uni-data-select
                v-model="form.AccountTypeName"
                :localdata="AccountTypeNameData"
              ></uni-data-select>
            </uni-forms-item>
            <uni-forms-item label="账户名称" label-width="170rpx">
              <uni-easyinput type="text" v-model="form.AccountCard" />
            </uni-forms-item>
            <uni-forms-item label="账户图标" label-width="170rpx">
              <uni-data-select v-model="form.iconPath" :localdata="iconPathData"></uni-data-select>
            </uni-forms-item>
          </uni-forms>
        </view>
      </uni-section>
      <button class="button btn" @click="ok">确认</button>
      <button class="button btn" @click="back">取消</button>
    </scroll-view>
  </view>
  <!-- 提示确认是否删除 弹窗 -->
  <uni-popup ref="alertDialog" type="dialog">
    <uni-popup-dialog
      type="warn"
      cancelText="取消"
      confirmText="确定"
      title="通知"
      content="确定要删除么？"
      @confirm="del"
      @close="cancel"
    ></uni-popup-dialog>
  </uni-popup>
</template>
<script setup lang="ts">
import { GetUserAccountAPI } from '@/services/detail'
import { AddUserAccountAPI, DelNoticeAPI, GetGoodTypesAPI } from '@/services/job'
import { useMemberStore } from '@/stores'
import type { AddUserAccountRequest, selectdata } from '@/types/job'
import { onLoad } from '@dcloudio/uni-app'
import { ref } from 'vue'
import { useRoute } from 'vue-router'
const route = useRoute()
// 获取屏幕边界到安全区域距离
const { safeAreaInsets } = uni.getSystemInfoSync()
// 获取会员信息
const memberStore = useMemberStore()
const form = ref<AddUserAccountRequest>({
  Auth: '',
  UserGroup: '',
  UserName: '',
  AccountTypeName: '',
  AccountCard: '',
  iconPath: '',
})
const iconPathData = ref([
  { value: '../../static/images/pingan.png', text: '平安银行' },
  { value: '../../static/images/jianshe.png', text: '建设银行' },
  { value: '../../static/images/zhaoshang.png', text: '招商银行' },
  { value: '../../static/images/wechat.png', text: '微信' },
  { value: '../../static/images/zhifubao.png', text: '支付宝' },
  { value: '../../static/images/gongjijin.png', text: '公积金' },
  { value: '../../static/images/yanglao.png', text: '养老金' },
  { value: '../../static/images/gupiao.png', text: '股票' },
  { value: '../../static/images/xianjing.png', text: '现金' },
])
const AccountTypeNameData = ref([
  { value: '日常账户', text: '日常账户' },
  { value: '养老账户', text: '养老账户' },
  { value: '应急账户', text: '应急账户' },
  { value: '投资账户', text: '投资账户' },
  { value: '个人账户', text: '个人账户' },
])
const statusdata = ref([
  { value: 0, text: '未存' },
  { value: 1, text: '已存' },
])
const monthdata = ref([
  { value: 1, text: '1' },
  { value: 2, text: '2' },
  { value: 3, text: '3' },
  { value: 4, text: '4' },
  { value: 5, text: '5' },
  { value: 6, text: '6' },
  { value: 7, text: '7' },
  { value: 8, text: '8' },
  { value: 9, text: '9' },
  { value: 10, text: '10' },
  { value: 11, text: '11' },
  { value: 12, text: '12' },
])

const accountTypedata = ref([
  { value: '收入', text: '收入' },
  { value: '支出', text: '支出' },
  { value: '转账', text: '转账' },
])
const checkdata = [
  { value: true, text: '是' },
  { value: false, text: '否' },
]
const repeateTypedata = ref([
  { value: '日', text: '日' },
  { value: '周', text: '周' },
  { value: '月', text: '月' },
  { value: '年', text: '年' },
])
//提示框
const alertDialog = ref<{
  open: (type?: UniHelper.UniPopupType) => void
  close: () => void
}>()
const ID = ref<number>()
const goodTypedata = ref<selectdata[]>()
const accountFromdata = ref<selectdata[]>()
const accountTodata = ref<selectdata[]>()
//============================以下函数========================
//加载初始化
onLoad(async (option) => {
  form.value.Auth = memberStore!.profile!.Token
  form.value.UserName = memberStore!.profile!.UserName
  form.value.UserGroup = memberStore!.profile!.UserGroup
})
/**
 * 获取任意时间
 */
const getDate = (date: Date, AddDayCount: number) => {
  if (!date) {
    date = new Date()
  }
  const dd = new Date(date)

  dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
  const y = dd.getFullYear()
  const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
  const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
  return {
    fullDate: y + '-' + m + '-' + d,
    year: y,
    month: m,
    date: d,
    day: dd.getDay(),
  }
}
//初始化账户列表
const InitUserAccount = async () => {
  if (memberStore.profile) {
    const res = await GetUserAccountAPI({
      UserName: memberStore.profile.UserName,
      Auth: memberStore.profile.Token,
      UserGroup: memberStore.profile.UserGroup,
    })
    let data = res.result.map((item) => ({ value: item.AccountNo, text: item.Display }))
    accountFromdata.value = data
    accountTodata.value = data
  }
}
//初始化商品类别
const InitGoodTypes = async (e: string) => {
  const res = await GetGoodTypesAPI({
    inout: e,
    UserGroup: memberStore.profile!.UserGroup,
  })
  goodTypedata.value = res.result
}

//返回
const back = () => {
  uni.switchTab({ url: '/pages/card/card' })
}
//确认
const ok = async () => {
  const res = await AddUserAccountAPI(form.value)

  // 成功提示
  uni.showToast({ icon: 'success', title: '保存成功' })
  setTimeout(() => {
    // 页面跳转
    uni.switchTab({ url: '/pages/card/card' })
  }, 500)
}
//删除时，打开确认框
const OnAlertDialog = async () => {
  alertDialog.value?.open()
}
//取消
const cancel = async () => {
  alertDialog.value?.close()
}
//确认删除
const del = async () => {
  const res = await DelNoticeAPI({
    Auth: memberStore!.profile!.Token,
    ID: ID.value!,
  })
  // 成功提示
  uni.showToast({ icon: 'success', title: '保存成功' })
  setTimeout(() => {
    // 页面跳转
    uni.navigateTo({ url: '/pages/NoteAcount/Notice' })
  }, 500)
}
</script>
<style lang="scss">
@import './styles/cardEdit.scss';
</style>
